<!DOCTYPE HTML>
<html>
<head>
    <script src="../resources/testharness.js"></script>
    <script src="../resources/testharnessreport.js"></script>
</head>
<body>
<script>
    var t = async_test("Test that a preload with a crossorigin attribute does not load a cross-origin resource that isn't CORS enabled.");
    var anonymousMarkupError = false;
    var credentialsMarkupError = false;
    var anonymousDynamicError = false;
    var credentialsDynamicError = false;
</script>
<link crossorigin="anonymous" rel="preload" as="fetch" href="http://localhost:8000/security/resources/abe.png?1" onerror="anonymousMarkupError = true;">
<link crossorigin="use-credentials" rel="preload" as="fetch" href="http://localhost:8000/security/resources/abe.png?2" onerror="credentialsMarkupError = true;">
<script>
    // Test that dynamically inserted <link> elements are handled the same way.
    var link = document.createElement("link");
    link.crossOrigin = "anonymous";
    link.rel = "preload";
    link.as = "fetch";
    link.addEventListener("error", function() { anonymousDynamicError = true; });
    link.href = "http://localhost:8000/security/resources/abe.png?3";
    document.body.appendChild(link);

    link = document.createElement("link");
    link.crossOrigin = "use-credentials";
    link.rel = "preload";
    link.as = "fetch";
    link.addEventListener("error", function() { credentialsDynamicError = true; });
    link.href = "http://localhost:8000/security/resources/abe.png?4";
    document.body.appendChild(link);

</script>
<script src="../resources/slow-script.pl?delay=500"></script>
<script>
    window.onload = t.step(function(){
        assert_true(anonymousMarkupError, "anonymous markup resource triggered error event");
        assert_true(credentialsMarkupError, "use-credentials markup resource triggered error event");
        assert_true(anonymousDynamicError, "anonymous dynamic resource triggered error event");
        assert_true(credentialsDynamicError, "use-credentials dynamic resource triggered error event");
        t.done();
    });
</script>
</body>
</html>
